<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="Expires" content="0">
    <meta http-equiv="Pragma" content="no-cache">
    <meta http-equiv="Cache-Control" content="no-store,no-cache"> 
    <meta name="Handheldfriendly" content="true">
    <!-- 微软的老式浏览器 -->
    <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <!-- 显示窗口 宽度 是 客户端的 屏幕 宽度 （就是 满屏 ！），显示的文字和图形的初始比例 是 1.0 -->
    <link rel="stylesheet" href="css/layui.css" media="all">
    <link rel="stylesheet" href="css/layui.mobile.css">
    <link rel="stylesheet" type="text/css" href="css/style.css"><!-- 基本样式 -->
    <script src="js/common.js"></script>
    <title>系统消息</title>
    <style>
        .layui-icon{
            color: #ccc;
            position: absolute;
            right: 10px;
            top: 50%;
            margin-top: -6px;
        }
        .spinner{width:20px;height:20px;position:fixed;z-index:1002;top:50%;margin-top:-10px;left:50%;margin-left:-10px}.container1>div,.container2>div,.container3>div{width:6px;height:6px;background-color:#ff536a;border-radius:100%;position:absolute;-webkit-animation:bouncedelay 1.2s infinite ease-in-out;animation:bouncedelay 1.2s infinite ease-in-out;-webkit-animation-fill-mode:both;animation-fill-mode:both}.spinner .spinner-container{position:absolute;width:100%;height:100%}.container2{-webkit-transform:rotateZ(45deg);transform:rotateZ(45deg)}.container3{-webkit-transform:rotateZ(90deg);transform:rotateZ(90deg)}.circle1{top:0;left:0}.circle2{top:0;right:0}.circle3{right:0;bottom:0}.circle4{left:0;bottom:0}.container2 .circle1{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}.container3 .circle1{-webkit-animation-delay:-1.0s;animation-delay:-1.0s}.container1 .circle2{-webkit-animation-delay:-0.9s;animation-delay:-0.9s}.container2 .circle2{-webkit-animation-delay:-0.8s;animation-delay:-0.8s}.container3 .circle2{-webkit-animation-delay:-0.7s;animation-delay:-0.7s}.container1 .circle3{-webkit-animation-delay:-0.6s;animation-delay:-0.6s}.container2 .circle3{-webkit-animation-delay:-0.5s;animation-delay:-0.5s}.container3 .circle3{-webkit-animation-delay:-0.4s;animation-delay:-0.4s}.container1 .circle4{-webkit-animation-delay:-0.3s;animation-delay:-0.3s}.container2 .circle4{-webkit-animation-delay:-0.2s;animation-delay:-0.2s}.container3 .circle4{-webkit-animation-delay:-0.1s;animation-delay:-0.1s}@-webkit-keyframes bouncedelay{0%,80%,100%{-webkit-transform:scale(0.0)}40%{-webkit-transform:scale(1.0)}}@keyframes bouncedelay{0%,80%,100%{transform:scale(0.0);-webkit-transform:scale(0.0)}40%{transform:scale(1.0);-webkit-transform:scale(1.0)}}#loading .mask{position:fixed;width:100%;background-color:#fff;top:0;left:0;height:100%;z-index:1001}
    </style>
</head>
<body>
<div id="loading">
    <div class="mask"></div>
    <div class="spinner">
        <div class="spinner-container container1">
            <div class="circle1"></div>
            <div class="circle2"></div>
            <div class="circle3"></div>
            <div class="circle4"></div>
        </div>
        <div class="spinner-container container2">
            <div class="circle1"></div>
            <div class="circle2"></div>
            <div class="circle3"></div>
            <div class="circle4"></div>
        </div>
        <div class="spinner-container container3">
            <div class="circle1"></div>
            <div class="circle2"></div>
            <div class="circle3"></div>
            <div class="circle4"></div>
        </div>
    </div>
</div>
    <div style="margin-bottom: 55px;">
        <div class="m-user-messageCenter"><!-- 系统消息s -->
            <div class="item">
                  <div class="system-messages">
                      <img src="cssimg/systemMessage.png">
                      <div class="basicInfo">
                          <span>系统消息提醒
                          </span>
                          <p class="line1">欢迎加入CP这个大家庭。</p>
                          <!--<i>07-21  8:00</i>-->
                      </div>
                  </div>
            </div> 
        </div><!-- 系统消息e-->

       <div id="list">
           <!--<div class="m-user-messageCenter">-->
               <!--<a href="Personal-information.html">-->
                   <!--<div class="system-messages">-->
                       <!--<img src="./cssimg/meimv.png">-->
                       <!--<div class="Leave-message">-->
                           <!--<p class="line-m">迪丽热巴给你留言了</p>-->
                           <!--<i>07-21  8:00</i>-->
                       <!--</div>-->
                   <!--</div>-->
               <!--</a>-->
           <!--</div>-->
       </div>


    </div>
<!--     菜单栏 -->
<footer>
    <ul class="tab-nav">
        <li>
            <a href="index.html">
                <div class="icon-box">
                    <i class="icon1"></i>
                </div>
                <div>
                    <span >首页</span>
                </div>
            </a>
        </li>
        <li>
            <a href="Single-circle.html">
                <div class="icon-box">
                    <i class="icondsp"></i>
                </div>
                <div>
                    <span>单身圈</span>
                </div>
            </a>
        </li>
        <li>
            <a href="">
                <div class="icon-box">
                    <i class="icon-xxhover"></i>
                </div>
                <div>
                    <span class="active">消息</span>
                </div>
            </a>
        </li>
        <li>
            <a href="activity.html">
                <div class="icon-box">
                    <i class="iconhd"></i>
                </div>
                <div>
                    <span>活动</span>
                </div>
            </a>
        </li>
        <li>
            <a href="mine.html">
                <div class="icon-box">
                    <i class="iconmy"></i>
                </div>
                <div>
                    <span>我的</span>
                </div>
            </a>
        </li>
    </ul>
</footer>
<script src="js/jquery/jquery-2.2.4.min.js"></script>
<script src="js/utils.js"></script>
<script>
    Utils.historyBack();
    var urs=window.location.search;
    var strs=urs.substring(1);
    var silp=strs.split('&');
    var res={};
    for (var i=0;i<silp.length;i++){
        res[silp[i].split("=")[0]]=silp[i].split("=")[1];
    }
    console.log(res);
    var time=Date.parse(new Date())/1000;
    console.log(time);
    $.ajax({
        type : "GET",
        url : getRequestUrl("/user/get_notify"),
        data:{
            notify_type_id:res.id,
            timestamp:time,
            page_num:1,
            page_size:100
        },
        // contentType : "application/json",
        success : function(datas) {
            console.log(datas.response_params.result);
            var arr=datas.response_params.result;
            var strs="";
            $.each(arr,function (i,el){
                //var time=new Date(parseInt(el.insert_time) * 1000).toLocaleString().replace(/上午||下午/,'').replace(/\//g,"-").substring(0,15);
                //console.log(time)
                strs+=`<div class="m-user-messageCenter pr" data-id=`+el.user_id+` onclick="getInfo(this)">
                           <div class="system-messages">
                               <img src=`+el.portrait+`>
                               <div class="Leave-message">
                                   <p class="line-m">`+el.content+`</p>
                                   <i>`+gstime(el.insert_time)+`</i>
                               </div>
                           </div>
                            <i class="layui-icon">&#xe602;</i>
                        </div>`
            });
            $(strs).appendTo("#list");
            $("#loading").hide();
        },
        error : function(err) {
        	dealCPErrorResponse(err);
        }
    });
    function gstime(time) {
        var strs="";
        var date = new Date(time*1000);
        var y = date.getFullYear() + '-';
        var m = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '-';
        var d = date.getDate() + ' ';
        var h = date.getHours()<10? '0'+date.getHours():date.getHours()+':';
        var s = date.getMinutes()<10? '0'+date.getMinutes():date.getMinutes();
        strs =y+m+d+h+s;
        return strs
    }
    function getInfo(obj) {
        var $this=$(obj);
        var id=$this.attr("data-id");
        window.location.href="Personal-information.html?userid="+id;
    }
</script>
</body>
</html>